import React, {useEffect, useState} from "react";
import {Icon} from "antd-mobile";
import "./Company.less"
import a1 from '../../../libs/img/outUser/a1.png'
import http from "../../../model/http";


const lookImg = (img,list)=>{
  // eslint-disable-next-line no-undef
  wx.previewImage({
    current: img, // 当前显示图片的http链接
    urls: list.map(i=>i.img_path) // 需要预览的图片http链接列表
  });
}


function Company(){

  const query = http.useQuery(),
      hosId = query.get('hosId'),
      [data,setData] = useState({tags:[],rongyu_pic:[],huanjing_pic:[]});

  useEffect(()=>{
    http.outPost('/mine/info',{hosId:hosId}).then(setData);
    // eslint-disable-next-line react-hooks/exhaustive-deps
  },[])

  return (
      <div className='v-company'>
        <div className='head g-flex'>
          <img className='head-img g-mr10' src={data.hos_logo} alt="logo"/>
          <div>
            <div className="g-flex g-y-center g-mb10">
              <span className='bold g-mr10'>{data.hos_name}</span>
              <p className="attest g-flex g-x-center g-y-center g-f12 "><Icon type='check' color='#108ee9' size="xxs"/>已认证</p>
            </div>
            <div className='g-f12 g-flex'>
              {data.tags.map(i=>(
                  <p className='g-flex g-y-center g-mr10'><img className='a1' src={a1} alt="a1"/>{i.tag}</p>
              ))}
            </div>
          </div>
        </div>

        <div className='body'>
          <p className="g-mt30 g-mb10 bold g-f18">基本信息</p>
          <p className="g-mb10 g-flex">
            <span className="g-flex0">营业时间：</span>
            <span>{data.work_time}</span>
          </p>
          <p className="g-mb10 g-flex">
            <span className="g-flex0">医院地址：</span>
            <span>{data.address}</span>
          </p>
          <p className="g-flex">
            <span className="g-flex0">重点科室：</span>
            <span>{data.key_dept}</span>
          </p>
          <p className="g-mt30 g-mb10 bold g-mt10 g-f18">重点项目</p>
          <p>{data.key_item}</p>
          <p className="g-mt30 g-mb10 bold g-mt10 g-f18">荣誉信息</p>
          <div className="img-list">
            {data.rongyu_pic.map(i=>(
                <img className='item g-mr10' src={i.img_path} alt="item" onClick={()=>{lookImg(i.img_path,data.rongyu_pic)}} />
            ))}
          </div>

          <p className="g-mt30 g-mb10 bold g-mt10 g-f18">医院环境</p>
          <div className="img-list">
            {data.huanjing_pic.map(i=>(
                <img className='item g-mr10' src={i.img_path} alt="item" onClick={()=>{lookImg(i.img_path,data.huanjing_pic)}}/>
            ))}
          </div>

        </div>

      </div>
  )
}

export default Company;